// loading组件，为了优化用户体验
import React from 'react';
import { Space, Spin } from 'antd';
import styled from 'styled-components';
import Pts from 'prop-types'
const Loading = (props) => {
    return (
            <Lod>
                <Spin size="large" tip={props.tip} spinning={props.spinning}/>
            </Lod>
    );
}
// 二次封装ui组件库提供的组件，需要思考的点
// 1\设置属性的默认值
Loading.defaultProps = {
    spinning:true,
    tip:'加载中...'
}
// 2\对参数类型进行类型校验
Loading.protoTypes={
    spinning:Pts.bool,
    tip:Pts.string

}

// 使用css in js技术设置Lading组件的样式
const Lod = styled.div`
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
`
export default Loading;
